<template>
    <div class="notice">
        <div class="box" @click="e_page_">
            <div class="ilbk" v-for="(v, i) in list" :key="i">
                <span v-if="i !== 0">/</span>
                <span class="titles cur animation" :data-i="i" v-text="v" />
            </div>
        </div>
    </div>
</template>

<script>
import { vpost, vlink } from '@api'
import { apiget_notice } from '@apigetter'
export default {
	data() {
		return {}
	},
	computed: {
		list() {
			return this.$store.state.notice.tlist2
		},
	},
	created() {
		apiget_notice(this)
	},
	methods: {
		e_page_(event) {
			let t = event.target
			let i = t.dataset.i
			if (i === undefined) {
				return false
			}
			i = Number(i)
			this.$store.commit('set_notice_which', i)
			this.$router.push('/notice/read')
		},
	},
}
</script>

<style scoped>
.notice {
	background-color: rgb(24, 27, 42);
	text-align: center;
	line-height: 60px;
	color: var(--clr0);
}
.box {
	margin: 0 auto;
	overflow: hidden;
	width: 1000px;
	height: 60px;
}
.titles {
	padding: 0 20px;
}
.titles:hover {
	color: var(--clr1);
}
</style>